<template>
	<view class="content">
		<image class="logo" src="../../static/logo.png"></image>
		<view>
			<text class="title" @click="onRightClick()">{{title}}1111kkk</text>
		</view>
		<y-content :father="title">
			<template slot="left">
				<view @click="onLeftClick()">{{leftBut}}tttttttttttttttttttttt</view>
			</template>
			<template slot="right">
			<view @click="login({username: '18017628732', phoneValid: '111111'})">{{rightBut}}</view>
			</template>
		</y-content>
		<y-popup-menu></y-popup-menu>
		<view @click="goIndex" v-for="(i, index) in [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 1]"
		 :key="index" :style="{backgroundColor: index % 2 == 0 ? 'red' : 'blue'}">{{index}}</view>
	</view>
</template>

<script>
	import yContent from '../../components/yContent/yContent.vue'
	import yPopupMenu from '../../components/yPopupMenu/yPopupMenu.vue'
	import {
		login
	} from '../../api/user.js'
	import {
		mapState,
		mapActions
	} from 'vuex'

	export default {
		data() {
			return {
				title: 'Hello',
				leftBut: "leftBut",
				rightBut: "rightBut"
			}
		},
		onReady() {

		},
		onShow() {

		},
		onLoad() {

		},
		computed: {
			...mapState(['order/productId', 'userinfo']),
			...mapState(['token'])
		},
		methods: {
			async onLeftClick() {
				console.log("onLeftClick")
				let data = await login({
					username: '18017628732',
					phoneValid: '111111'
				})
				console.log(data)
				this.leftBut = data.body.accessToken
				uni.navigateTo({
					url: '/pages/home/home?id=1',

				})
			},
			onRightClick() {
				console.log("onRightClick")
				this.title = "hohohohohoho"
				console.log(this.productId, this.userinfo.userId, this.token)
			},
			...mapActions(['login'])
		},
		components: {
			yContent: yContent,
			yPopupMenu: yPopupMenu
		}
	}
</script>

<style>
	.content {
		text-align: center;
		height: 400upx;
	}

	.logo {
		height: 200upx;
		width: 200upx;
		margin-top: 200upx;
	}

	.title {
		font-size: 36upx;
		color: #8f8f94;
	}
</style>
